/*
 * @Description: state Hook
 * @Author: 姚泽毅
 * @Date: 2021-09-02 17:25:33
 * @LastEditTime: 2021-09-02 17:40:27
 */
import React, { Component } from 'react'

// export default class Demo extends Component {
//     state = {
//         count: 0
//     }
//     add = () => {
//         this.setState(state => ({ count: state.count + 1 }))
//     }
//     render() {
//         const { count } = this.state
//         return (
//             <div>
//                 <h2>当前求和为：{count}</h2>
//                 <button onClick={this.add}>点击加1</button>
//             </div>
//         )
//     }
// }


//调用1+n次类似render
export default function Demo() {
    //不会因为再次调用重新赋值为0
    const [count, setCount] = React.useState(0)
    const [name, setName] = React.useState("tom")
    function add() {
        // setCount(count + 1)
        setCount(count => count + 1)
    }
    function cha() {
        setName("jack")
    }
    return (
        <div>
            <h2>当前求和为：{count}</h2>
            <button onClick={add}>点击加1</button>
            <h2>当前名字为：{name}</h2>
            <button onClick={cha}>点击改名</button>
        </div>
    )
}